// 函数
function classGetPriority(value) {
    if (!value) return;

    let status = null;
    if (value === "未毕业") status = "dhx-demo_grid-status--done";
    if (value === "已毕业") status = "dhx-demo_grid-status--not-started";
    return `
		<div class='dhx-demo_grid-template'>
			<div class='dhx-demo_grid-status ${status}'></div>
			<span>${value}</span>
		</div>
	`
}

// 静态配置
const studentInformationTemplate = ({ name, id, gender, img, status }) => {
    return `
        <div class="dhx_dataview_template_c">
            <div class="dhx_dataview_template_c__inside">
                <div class="dhx_dataview_template_c__picture" style="background-image: url(${img});"></div>
                <div class="dhx_dataview_template_c__body">
                    <div class="dhx_dataview_template_c__row">
                        <span class="dhx_dataview_template_c__icon mdi mdi-account-outline"></span>
                        <span class="dhx_dataview_template_c__title">姓名：${name}</span>
                    </div>
                    <div class="dhx_dataview_template_c__row">
                        <span class="dhx_dataview_template_c__icon mdi mdi-card-account-details-outline"></span>
                        <span class="dhx_dataview_template_c__title">学号：${id}</span>
                    </div>
                    <div class="dhx_dataview_template_c__row">
                        <span class="dhx_dataview_template_c__icon mdi mdi-human-male-female"></span>
                        <span class="dhx_dataview_template_c__text">性别：${gender}</span>
                    </div>
                </div>
                <div class="dhx_dataview_template_c__status dhx_dataview_template_c__status--${status}"></div>
            </div>
        </div>
    `;
};

// UI配置
export const boardClassConfig = {
    // 核心属性
    cols: [
        {
            id: "classColumn",
            type: "line",
            rows: [
                { id: "classToolbar", height: 56, },
                { id: "classGrid" },
            ],
        },
        {
            id: "studentColumn",
            type: "line",
            rows: [
                { id: "studentToolbar", height: 56, },
                { id: "studentDataview" },
            ],
        },
    ],
    // 交互配置
    // 事件绑定
    // 布局配置
    css: "dhx_layout_cell--overflow-auto",
    type: "line",
    // 其他默认值
}

export const classToolbarConfig = {
    // 核心属性
    data: [
        { type: "spacer" },
        {
            "id": "creat",
            "type": "button",
            "value": "新建班级",
        },
    ],
    // 交互配置
    // 事件绑定
    // 布局配置
    css: "app-class-toolbar"
    // 其他默认值
}

export const classGridConfig = {
    // 核心属性
    columns: [
        {
            id: "className",
            header: [
                { text: "班级名称", align: "center" },
                { content: "comboFilter", tooltipTemplate: () => "选择一个班级" }
            ],
            align: "center",
            resizable: true,
        },
        {
            id: "number",
            header: [
                { text: "学生人数", align: "center" },
                { content: "inputFilter" }
            ],
            align: "center",
        },
        {
            id: "startDate",
            header: [{ text: "创建日期", align: "center" }, { content: "inputFilter" }],
            align: "center",
            type: "date",
            dateFormat: "%Y/%m/%d",
            editorConfig: { asDateObject: true }
        },
        {
            id: "status",
            header: [{ text: "状态", align: "center" }, { content: "selectFilter" }],
            editorType: "combobox",
            options: ["未毕业", "已毕业"],
            editorConfig: {
                template: ({ value }) => classGetPriority(value)
            },
            template: classGetPriority,
            htmlEnable: true
        },
        {
            id: "actions",
            header: [{ text: "操作", tooltip: true, align: "center", rowspan: 2 }],
            mark: () => "dhx-demo_color--gray",
            template: () => `<i class="dxi dxi-dots-vertical row-menu"></i>`,
            align: "center",
            tooltip: false, editable: false, sortable: false, htmlEnable: true,
        }
    ],
    // 交互配置
    dragItem: "both",
    editable: false,
    keyNavigation: true,
    selection: "row",
    // 事件绑定
    // 布局配置
    autoWidth: true,
    height: "auto",
    leftSplit: 1,
    // 其他默认值
}

export const classContextMenuConfig = {
    // 核心属性
    data: [
        { id: "edit", value: "编辑班级", "icon": "dxi dxi-plus" },
        { id: "delete", value: "删除班级", "icon": "dxi dxi-delete" },
    ],
    // 交互配置
    // 事件绑定
    // 布局配置
    css: "dhx_widget--bordered",
    // 其他默认值
}

export const studentToolbarConfig = {
    // 核心属性
    data: [
        {
            "id": "return",
            "type": "button",
            "view": "link",
            "color": "secondary",
            "icon": "mdi mdi-arrow-left",
        },
        { "id": "creat", "value": "手动创建学生" },
        { "id": "upload", "value": "批量上传学生" },
        { "id": "edit", "value": "编辑选中学生" },
        { "id": "delete", "value": "删除选中学生" },
    ],
    // 交互配置
    // 事件绑定
    // 布局配置
    css: "dhx_widget--bordered",
    // 其他默认值
}

export const studentDataviewConfig = {
    // 核心属性
    template: studentInformationTemplate,
    // 交互配置
    // 事件绑定
    // 布局配置
    css: "dhx_dataview_template_c_box",
    // 其他默认值
    gap: 8,
    itemsInRow: 2,
    selection: true,
}

// 测试数据
export const allStudentsPool = [
    { name: "张伟", id: "001", gender: "男", img: "https://snippet.dhtmlx.com/codebase/data/common/img/03/flower_01.jpg", status: "uncheck", src: "" },
    { name: "欧阳雪华", id: "002", gender: "女", img: "https://snippet.dhtmlx.com/codebase/data/common/img/03/flower_02.jpg", status: "uncheck", src: "" },
    { name: "王建国", id: "003", gender: "男", img: "https://snippet.dhtmlx.com/codebase/data/common/img/03/flower_03.jpg", status: "uncheck", src: "" },
    { name: "李思涵", id: "004", gender: "女", img: "https://snippet.dhtmlx.com/codebase/data/common/img/03/flower_04.jpg", status: "uncheck", src: "" },
    { name: "司马长风", id: "005", gender: "男", img: "https://snippet.dhtmlx.com/codebase/data/common/img/03/flower_05.jpg", status: "uncheck", src: "" },
    { name: "陈雨桐", id: "006", gender: "女", img: "https://snippet.dhtmlx.com/codebase/data/common/img/03/flower_06.jpg", status: "uncheck", src: "" },
    { name: "刘浩然", id: "007", gender: "男", img: "https://snippet.dhtmlx.com/codebase/data/common/img/03/flower_07.jpg", status: "uncheck", src: "" },
    { name: "上官婉儿", id: "008", gender: "女", img: "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_01.jpg", status: "uncheck", src: "" },
    { name: "赵天佑", id: "009", gender: "男", img: "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_02.jpg", status: "uncheck", src: "" },
    { name: "黄晓彤", id: "010", gender: "女", img: "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_03.jpg", status: "uncheck", src: "" },
    { name: "周文博远", id: "011", gender: "男", img: "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_04.jpg", status: "uncheck", src: "" },
    { name: "吴雅琪", id: "012", gender: "女", img: "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_05.jpg", status: "uncheck", src: "" },
    { name: "徐明哲", id: "013", gender: "男", img: "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_06.jpg", status: "uncheck", src: "" },
    { name: "孙梦瑶", id: "014", gender: "女", img: "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_07.jpg", status: "uncheck", src: "" },
    { name: "胡一鸣", id: "015", gender: "男", img: "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_08.jpg", status: "uncheck", src: "" },
    { name: "林星辰大海", id: "016", gender: "女", img: "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_09.jpg", status: "uncheck", src: "" },
    { name: "高志强", id: "017", gender: "男", img: "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_10.jpg", status: "uncheck", src: "" },
    { name: "郑小雅", id: "018", gender: "女", img: "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_11.jpg", status: "uncheck", src: "" },
    { name: "钱浩宇轩", id: "019", gender: "男", img: "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_12.jpg", status: "uncheck", src: "" },
    { name: "冯紫萱", id: "020", gender: "女", img: "https://snippet.dhtmlx.com/codebase/data/common/img/02/avatar_13.jpg", status: "uncheck", src: "" }
];

export const classData = [
    {
        className: "2022级1班",
        number: 50,
        startDate: "Fri Feb 02 2022 00:00:00",
        status: "已毕业",
        students: allStudentsPool.slice(0, 5),
    },
    {
        className: "2022级2班",
        number: 55,
        startDate: "Sun Mar 03 2022 00:00:00",
        status: "已毕业",
        students: allStudentsPool.slice(5, 10),
    },
    {
        className: "2025级3班",
        number: 56,
        startDate: "Mon Jan 01 2025 00:00:00",
        status: "未毕业",
        students: allStudentsPool.slice(10, 15),
    },
    {
        className: "2025级4班",
        number: 60,
        startDate: "Tue Jan 10 2025 00:00:00",
        status: "未毕业",
        students: allStudentsPool.slice(15, 20),
    },
];
